<template>
	<view>
		<view class="box">
			<view class="menu_content_box_page">
				<view class="pa15">
					<view class="area_block_1">
						<view class="flex_box">
							<view class="mr20 re">
								<image :src="data.icon" :lazy-load="true" class="img19 vt"></image>
							</view>
							<view class="item">
								<view class="mt5 fs30 cor_000">{{data.name}}</view>
								<view class="mt25 fs26 cor_000">{{data.phone}}</view>
								<view class="mt20 df">
									<view class="pt10">
										<image :lazy-load="true" src="/static/icon_location_2.png" class="vt img7"></image>
									</view>
									<view class="ml5 fs26 lh36 cor_000">{{data.address}}</view>
								</view>
							</view>
						</view>

					</view>

					<view class="mt15 df fldr fw jcsb">

						<view class="shop_price_item" v-for="(item, index) in data.page.data" :key="index">
							<view class="re">
								<image :lazy-load="true" :src="item.imgUrl" @click="toPartDetail(item.id)" class="img2 vt">
								</image>
							</view>
							<view class="content_area">
								<view class="fs26 lh36 ell">{{item.name}}</view>
								<!-- <view class="fs26 lh36 ell">2020年 900小时</view> -->
								<view class="mt25 flex_box aic">
									<view class="item">
										<view class="fs30 fwb cor_F23"><text class="fs34">￥{{item.price}}</text>
										</view>
									</view>
									<image :lazy-load="true" src="/static/icon_location.png" class="img3"></image>
									<view class="ml5 fs24 fwb cor_808">{{item.place}}</view>
								</view>
							</view>
						</view>



					</view>

				</view>
			</view>
		</view><!-- box -->
	</view>


</template>

<script>
	import {
		toast,
		showLoading,
		hideLoading
	} from '@/utils/toast.js';
	import {
		getStoreViewApi
	} from '@/http/api.js';
	export default {
		data() {
			return {
				type: '',
				currentPage: 1,
				pageSize: 10,
				data: null
			}
		},
		onLoad(options) {
			this.id = options.id;
			this.type = options.type
			this.loadShopDetail();
		},
		onBackPress(options) {
		    uni.redirectTo({
		    	url: '/pages/personal_stores/personal_stores'
		    })
			return true;
		},
		methods: {
			loadShopDetail: function() {
				let that = this;

				var param = {
					pageIndex: this.currentPage,
					pageSize: this.pageSize
				}
				if (this.type == 'storeId') {
					param.storeId = this.id;
				} else {
					param.compId = this.id;
				}
				showLoading();
				getStoreViewApi(param).then(res => {
					console.log(res)
					that.data = res.data;
					hideLoading();
				}).catch(err => {
					hideLoading();
				})
			},
			toPartDetail(id) {
				let url = '/pages/sales_details_of_accessories/sales_details_of_accessories?id=' + id +
						'&store_id=' + this.id;
				console.log(url);
				uni.redirectTo({
					url: url
				})

			},
		}
	}
</script>

<style>
	page {
		background-color: #f7f6f6;
	}

	.menu_content_box_page {
		position: relative;
		/* height: 100vh; */
		background-color: #f7f6f6;
	}

	.area_block_1 {
		padding: 36rpx 25rpx;
		background-color: #fff;
		border-radius: 20rpx;
	}

	.shop_price_item {
		width: 350rpx;
		background-color: #fff;
		border-radius: 6rpx;
		margin-bottom: 15rpx;
	}

	.shop_price_item .content_area {
		padding: 15rpx 13rpx;
		height: 174rpx;
	}
</style>
